<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>GPS路线</title>
    <script src="http://api.map.baidu.com/api?v=2.0&ak=UcwUdVR33mNnmpuWLHDORDar"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/library/LuShu/1.2/src/LuShu_min.js"></script>
    <style type="text/css">
    body {
    	padding: 0;
    	margin: 0 auto;
    }
    #map_canvas{ width: 80%; height: 500px; border: 2px solid #42c300; padding: 0; margin: 0 auto;}
    .button{
    	width: 80%;
    	padding: 0;
    	margin: 0 auto;
    }
    </style>
</head>
<body>
    <div id="map_canvas"></div>
    <div class="button">
    <input type="button" id="run" value="开始">
    <input type="button" id="stop" value="停止">
    <input type="button" id="hide" value="隐藏信息窗口">
    <input type="button" id="show" value="展示信息窗口">
    </div>

    <script>
		var map = new BMap.Map("map_canvas");
		map.enableScrollWheelZoom();
		map.centerAndZoom(new BMap.Point(120.409, 30.356), 12);
		var myP1 = new BMap.Point(120.030, 30.257);
		var myP2 = new BMap.Point(120.340, 30.458);
		var gps;
		var drv = new BMap.DrivingRoute('杭州', {
			onSearchComplete: function(res) {
				if (drv.getStatus() == BMAP_STATUS_SUCCESS) {

					var plan = res.getPlan(0);
					var arrPois = [];
					for (var j = 0; j < plan.getNumRoutes(); j++) {
						var route = plan.getRoute(j);
						arrPois = arrPois.concat(route.getPath());
					}
				//	map.addOverlay(new BMap.Polyline(arrPois, {strokeColor: '#42c300'}));
					map.setViewport(arrPois);

					gps = new BMapLib.LuShu(map, arrPois, {
						defaultContent: "从天上到地下",
						autoView:true,
						icon: new BMap.Icon('http://developer.baidu.com/map/jsdemo/img/car.png', new BMap.Size(52,26),{anchor : new BMap.Size(27, 13)}),
						speed: 3500,
						landmarkPois: [

						]
					});

				}
			}
		});
		drv.search(myP1, myP2);
		var on = false;
		$("run").onclick = function() {
			if (on) {
				this.value = "开始";
				gps.pause();
				on = false;
			} else {
				on = true;
				this.value="暂停";
				gps.start();
			}
		}
		$("stop").onclick = function() {
			on = false;
			$("run").value = "开始";
			gps.stop();
		}
		$("show").onclick = function() {
			gps.showInfoWindow();
		}
		$("hide").onclick = function() {
			gps.hideInfoWindow();
		}

		function $(element) {
			return document.getElementById(element);
		}
    </script>
</body>
</html>